<template>
    <view class="component">
        <up-form labelPosition="left" :model="form" labelWidth="80" :rules="rules" ref="statisticsFormRef">
            <up-form-item label="真实来电" prop="chengJiao" borderBottom>
                <up-input v-model="form.chengJiao" placeholder="请输入真实来电总数" border="none"></up-input>
            </up-form-item>

            <up-form-item label="真实到访" prop="daoFang" borderBottom>
                <up-input v-model="form.daoFang" placeholder="请输入真实到访" border="none"></up-input>
            </up-form-item>

            <up-form-item label="真实签约" prop="wangQian" borderBottom>
                <up-input v-model="form.wangQian" placeholder="请输入真实签约" border="none"></up-input>
            </up-form-item>
        </up-form>
        <view class="btn bg-theme font18 col-fff text-center top-20" @click="clickSubmit">
            提交
        </view>
    </view>
</template>

<script setup>
import { useUserInfoStore } from '@/store/index';
const userInfoStore = useUserInfoStore();

import { ref } from 'vue';

let form = ref({
    daoFang: '',
    chengJiao: '',
    wangQian: ''
})

let rules = ref({
    daoFang: [{
        required: true,
        message: '请输入真实到访',
        trigger: ['change', 'blur'],
    }],
    chengJiao: [{
        required: true,
        message: '请输入真实来电',
        trigger: ['change', 'blur'],
    }],
    wangQian: [{
        required: true,
        message: '请输入真实签约',
        trigger: ['change', 'blur'],
    }]
})

// 表单引用  
const statisticsFormRef = ref(null);

//提交
function clickSubmit() {
    statisticsFormRef.value.validate().then(valid => {
        if (valid) {
            uni.$u.toast('校验通过')
            // userInfoStore.setShowStatisticsForm(false);
        } else {
            uni.$u.toast('校验失败')
        }
    }).catch(() => {
        // 处理验证错误  
        uni.$u.toast('校验失败')
    });
}

</script>

<style scoped lang="scss">
.component {
    .btn {
        width: 70%;
        margin: 40rpx auto;
        height: 80rpx;
        line-height: 80rpx;
        border-radius: 40rpx;
    }
}
</style>
